<template>
  <div>
    <div style="display: flex; justify-content: flex-start">
      <el-input
        placeholder="档案号/姓名"
        v-model="page.searchObj.query"
        autofocus
        style="width: 230px; margin-right: 30px"
        clearable
        ><i slot="prefix" class="el-input__icon el-icon-search"></i
      ></el-input>
      <el-button type="primary" icon="el-icon-search" @click="query"
        >搜索</el-button
      >
    </div>
    <el-button
      type="primary"
      style="display: flex; justify-content: flex-start; margin: 10px 0"
      @click="dialogTableVisible = true"
      >新增</el-button
    >
    <el-table
      :data="tableData"
      style="width: 100%"
      height="65vh"
      highlight-current-row
    >
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column prop="id" label="档案号"> </el-table-column>
      <el-table-column prop="name" label="姓名"> </el-table-column>
      <el-table-column prop="date" label="评估日期"> </el-table-column>
      <el-table-column prop="lack_of_vital_energy" label="阳虚体质">
      </el-table-column>
      <el-table-column prop="deficiency_of_yin" label="阴虚体质">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="">
          <span>
            <el-button type="primary" icon="el-icon-edit" circle></el-button>
          </span>
        </template>
      </el-table-column>
    </el-table>
    <div class="block">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="page.pageNum"
        :page-sizes="[5, 10]"
        :page-size="page.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>
    <!-- 新增 -->
    <el-dialog width="80%" title="新增问卷" :visible.sync="dialogTableVisible">
      <el-form
        :inline="true"
        :model="formInline"
        class="demo-form-inline"
        style="display: flex; justify-content: flex-start; margin-left: 20px"
      >
        <el-form-item label="身份证">
          <el-input
            v-model="formInline.card"
            placeholder="请输入身份证"
            @input="clear"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">查询</el-button>
        </el-form-item>
        <el-form-item label="姓名">
          <el-input v-model="obj.name" disabled></el-input>
        </el-form-item>
        <el-form-item label="年龄" style="margin-left: 20px">
          <el-input v-model="obj.age" disabled></el-input>
        </el-form-item>
        <el-form-item label="性别">
          <el-input v-model="obj.sex" disabled></el-input>
          <template> </template>
        </el-form-item>
      </el-form>
      <el-tabs type="border-card">
        
        <el-tab-pane label="阳虚体质">
          <el-row :gutter="20" v-for="(tableData,index) in tableData1" :key="tableData.index">
              <el-col :span="6" style="display:flex;justify-content: flex-start;">{{ tableData.question }}</el-col>
              <el-col :span="3">
                <el-radio v-model="radio1[index]" label="5">没有（根本不）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio1[index]"  label="4">很少（有一点）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio1[index]"  label="3">有时（有些）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio1[index]" label="2">经常（相当）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio1[index]" label="1">总是（非常）</el-radio>
              </el-col>
          </el-row>
        </el-tab-pane>

        <el-tab-pane label="阴虚体质">
          <el-row :gutter="20" v-for="(tableData,index) in tableData2" :key="tableData.index">
              <el-col :span="6">{{ tableData.question }}</el-col>
              <el-col :span="3">
                <el-radio v-model="radio2[index]" label="5">没有（根本不）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio2[index]"  label="4">很少（有一点）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio2[index]"  label="3">有时（有些）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio2[index]" label="2">经常（相当）</el-radio>
              </el-col>
              <el-col :span="3">
                <el-radio v-model="radio2[index]" label="1">总是（非常）</el-radio>
              </el-col>
          </el-row>
        </el-tab-pane>





      </el-tabs>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogTableVisible = false">取 消</el-button>
        <el-button type="primary" @click="save">提交</el-button>
      </div>
    </el-dialog>
  </div>
</template>
  
  <script>
export default {
  data() {
    return {
      radio1:[],
      radio2:[],
      formInline: {
        //查询预约
        card: "",
        nmae: "",
      },
      dialogTableVisible: false,
      page: {
        //分页查询条件
        pageNum: 1, //当前页
        pageSize: 5, //页面数量
        searchObj: {
          //条件对象
          query: "", //档案号/姓名
        },
      },
      tableData: [], //表格数据
      total: 0, //总数量
      tableData1: [],//阳虚
      tableData2: [],//阴虚
      obj: {
        rid:0,
        id: "",
        name: "",
        age: "",
        sex: "",
        date: "",
        lack_of_vital_energy: "",
        deficiency_of_yin: "",
      },
    };
  },
  created() {
    this.queryPhysiqueAll();
    this.queryQuestionBankType1();
    this.queryQuestionBankType2();
  },
  methods: {
    clear() {
      this.obj.rid = 0;
      this.obj.id = "";
      this.obj.name = "";
      this.obj.age = "";
      this.obj.sex = "";
    },
    onSubmit() {
      this.axios
        .get("/api/hj/queryBookingState", {
          params: {
            card: this.formInline.card,
          },
        })
        .then((result) => {
          console.log(result.data);
          if (result.data != "") {
            this.obj.rid = result.data.rid;
            this.obj.id = result.data.file_number;
            this.obj.name = result.data.name;
            this.obj.age = result.data.age;
            this.obj.sex = result.data.sex == 0 ? "女" : "男";
          } else {
            this.obj.rid = 0;
            this.obj.id = "";
            this.obj.name = "";
            this.obj.age = "";
            this.obj.sex = "";
          }
        });
    },
    handleSizeChange(val) {
      this.page.pageSize = val;
      this.queryPhysiqueAll();
    },
    handleCurrentChange(val) {
      this.page.pageNum = val;
      this.queryPhysiqueAll();
    },
    //条件查询
    query() {
      this.queryPhysiqueAll();
    },
    //   查询所有用体质评测
    queryPhysiqueAll() {
      this.axios.post("/api/hj/queryPhysiqueAll", this.page).then((result) => {
        this.total = result.data.total;
        this.tableData = result.data.list;
      });
    },
    //阳虚体质
    queryQuestionBankType1() {
      this.axios.post("/api/hj/queryQuestionBankType1").then((result) => {
        this.tableData2 = result.data;
      });
    },
    //阴虚体质
    queryQuestionBankType2() {
      this.axios.post("/api/hj/queryQuestionBankType2").then((result) => {
        this.tableData1 = result.data;
      });
    },
    //新增
    save(){
      let f1 = false;
      if(this.tableData1.length==this.radio1.length){
        // 阳虚
      //转化分数 =( 原始分- 条目数)÷( 条目数× 4)×100
      let score1=0;
      let count1=0;//原始分
      let itemCount1=this.tableData1.length;//条目数
      this.radio1.forEach(r=>{
        count1=count1+parseInt(r);
      })
      score1=(count1-itemCount1)/(itemCount1*4)*100;
      if(score1<30 || score1<40){
        this.obj.lack_of_vital_energy="是";
      }else{
        this.obj.lack_of_vital_energy="否";
      }
        f1=true;
      }
      let f2 = false;
      if(this.tableData2.length==this.radio2.length){
        //阴虚
      let score2=0;
      let count2=0;//原始分
      let itemCount2=this.tableData2.length;//条目数
      this.radio2.forEach(r=>{
        count2=count2+parseInt(r);
      })
      score2=(count2-itemCount2)/(itemCount2*4)*100;
      if(score2<30 || score2<40){
        this.obj.deficiency_of_yin="是";
      }else{
        this.obj.deficiency_of_yin="否";
      }
        f2=true;
      }
      if(this.obj.id!=''){
        if(f1 && f2){
          let date = new Date();
        this.obj.date=date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate();
        if(this.obj.sex=='男'){
            this.obj.sex=1;
        }else{
          this.obj.sex=0;
        }
        console.log(this.obj);
        this.axios.post("/api/hj/savePhysique",this.obj)
        .then(result=>{
          if(result.data>0){
            this.queryPhysiqueAll();
            this.$message({
          showClose: true,
          message: '成功操作一条数据',
          type: 'success'
        });
          this.dialogTableVisible=false;
          }
        })
      }else{
        this.$message({
          showClose: true,
          message: '请填写完问卷'
        });
      }
      }else{
        this.$message({
          showClose: true,
          message: '请先查询问卷身份信息'
        });
      }   
    },
  },
};
</script>
  
  <style>
</style>